import { rect } from "..";

interface MosaicDrawInfo {
  w?: number;
  h?: number;
  color1?: string;
  color2?: string;
}

/**
 * 绘制马赛克背景
 * @param ctx 绘图上下文
 * @param info: w - 马赛克宽度，h - 马赛克高度，默认与 w 相同, color1/color2 为马赛克颜色控制
 * @returns
 */
export function drawMosaic(
  ctx: CanvasRenderingContext2D,
  info: MosaicDrawInfo
) {
  let { w, h, color1, color2 } = info;
  if (!ctx) return;
  const canvas = ctx.canvas;
  if (!w) w = 50;
  if (!h) h = w;
  if (!color1) color1 = "#aaa";
  if (!color2) color2 = "#fff";
  const colors = [color1, color2];
  let i = 0;
  while (i * h < canvas.height) {
    const y = i * h;
    let j = 0;
    while (j * w < canvas.width) {
      const x = j * w;
      rect.draw(ctx, { x, y, w, h, fillStyle: colors[(i + j) % 2] });
      j++;
    }
    i++;
  }
}
